﻿<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<TITLE>登录页面</TITLE>
<STYLE>
body { background: #ebebeb; font-family: "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", "\9ED1\4F53", Arial, sans-serif; color: #222; font-size: 12px; }
* { padding: 0px; margin: 0px; }
.top_div { background: black; width: 100%; height: 380px; }
.ipt { border: 1px solid #d3d3d3; padding: 10px 10px; width: 290px; border-radius: 4px; padding-left: 35px; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); box-shadow: inset 0 1px 1px rgba(0,0,0,.075); -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s }
.ipt:focus { border-color: #66afe9; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6) }
.u_logo { background: url("__COMPATH__/images/username.png") no-repeat; padding: 10px 10px; position: absolute; top: 43px; left: 40px; }
.p_logo { background: url("__COMPATH__/images/password.png") no-repeat; padding: 10px 10px; position: absolute; top: 12px; left: 40px; }
a { text-decoration: none; }
.tou { background: url("__COMPATH__/images/tou.png") no-repeat; width: 97px; height: 92px; position: absolute; top: -87px; left: 140px; }
.left_hand { background: url("__COMPATH__/images/left_hand.png") no-repeat; width: 32px; height: 37px; position: absolute; top: -38px; left: 150px; }
.right_hand { background: url("__COMPATH__/images/right_hand.png") no-repeat; width: 32px; height: 37px; position: absolute; top: -38px; right: -64px; }
.initial_left_hand { background: url("__COMPATH__/images/hand.png") no-repeat; width: 30px; height: 20px; position: absolute; top: -12px; left: 100px; }
.initial_right_hand { background: url("__COMPATH__/images/hand.png") no-repeat; width: 30px; height: 20px; position: absolute; top: -12px; right: -112px; }
.left_handing { background: url("__COMPATH__/images/left-handing.png") no-repeat; width: 30px; height: 20px; position: absolute; top: -24px; left: 139px; }
.right_handinging { background: url("__COMPATH__/images/right_handing.png") no-repeat; width: 30px; height: 20px; position: absolute; top: -21px; left: 210px; }
.ldh { text-align: center; line-height: 230px; position: relative; top: -500px; font-size: 80px; color: #FFFFFF; font-weight: bold; }
.adminlogin { display: none }
.sublogin { background: rgb(0, 142, 173); padding: 7px 20px; border-radius: 4px; border: 1px solid rgb(26, 117, 152); border-image: none; color: rgb(255, 255, 255); font-weight: bold; cursor: pointer }
.subl { height: 50px; line-height: 50px; margin-top: 30px; border-top-color: rgb(231, 231, 231); border-top-width: 1px; border-top-style: solid; }
#code { width: 90px; margin-top: 10px; padding-left: 4px; }
.code { width: 120px; position: relative; top: 20px; top: 15px; left: 10px; }
.code:hover { cursor: pointer }
/**/

.Validform_checktip { margin-left: 8px; line-height: 20px; height: 20px; overflow: hidden; color: #999; font-size: 12px; }
.Validform_right { color: #71b83d; padding-left: 20px; background: url(__COMPATH__/images/right.png) no-repeat left center; }
.Validform_wrong { color: red; padding-left: 20px; white-space: nowrap; background: url(__COMPATH__/images/error.png) no-repeat left center; }
.Validform_loading { padding-left: 20px; background: url(__COMPATH__/images/onLoad.gif) no-repeat left center; }
.Validform_error { background-color: #ffe7e7; }
#Validform_msg { color: #7d8289; font: 12px/1.5 tahoma, arial, \5b8b\4f53, sans-serif; width: 280px; -webkit-box-shadow: 2px 2px 3px #aaa; -moz-box-shadow: 2px 2px 3px #aaa; background: #fff; position: absolute; top: 0px; right: 50px; z-index: 99999; display: none; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#999999');
}
#Validform_msg .iframe { position: absolute; left: 0px; top: -1px; z-index: -1; }
#Validform_msg .Validform_title { line-height: 25px; height: 25px; text-align: left; font-weight: bold; padding: 0 8px; color: #fff; position: relative; background-color: #f37b1d; }
#Validform_msg a.Validform_close:link, #Validform_msg a.Validform_close:visited { line-height: 22px; position: absolute; right: 8px; top: 0px; color: #fff; text-decoration: none; }
#Validform_msg a.Validform_close:hover { color: #cc0; }
#Validform_msg .Validform_info { padding: 8px; border: 1px solid #f37b1d; border-top: none; text-align: left; }
</STYLE>
<META name="GENERATOR" content="MSHTML 11.00.9600.17496">
<script>

//跳出框架

if(top.location!=self.location){

   top.location.href=""

} 

</script>
</HEAD>

<BODY style="width:100%;">
<DIV class="top_div">
  <div class="ldh">CYcms</div>
</DIV>
<DIV style="background: rgb(255, 255, 255);    position: relative; margin: -100px auto auto; border: 1px solid rgb(231, 231, 231); border-image: none; width: 400px;   text-align: center;" class="adminlogin">
  <DIV style="width: 165px; height: 96px; position: absolute; left:15px;">
    <DIV class="tou"></DIV>
    <DIV class="initial_left_hand" id="left_hand"></DIV>
    <DIV class="initial_right_hand" id="right_hand"></DIV>
  </DIV>
  <form  class="registerform" action="" method="post">
    <P style="padding: 30px 0px 10px; position: relative;"> <SPAN  class="u_logo"></SPAN>
      <INPUT class="ipt" type="text" name="username" datatype="*" placeholder="账户名" >
    </P>
    <P style="position: relative;"> <SPAN class="p_logo"></SPAN>
      <INPUT class="ipt" type="password" name="password"  datatype="*" placeholder="密码">
    </P>
    <P style="position: relative; text-align:left;    padding-left: 31px;">
      <INPUT class="ipt" id="code"  name="code" type="text" placeholder="请输入验证码"  datatype="*" >
      <img src="{:U('Public/code')}" class="code" onClick="this.src='{:U('Public/code')}?'+Math.random();" /> </P>
    <DIV class="subl">
      <P style="margin: 0px 35px 20px 45px;"> <SPAN style="float: right;">
        <input type="submit" class="sublogin btnSubmit" value="登 录" />
        </SPAN> </P>
    </DIV>
  </form>
</DIV>
</BODY>
<SCRIPT src="__COMPATH__/lib/jquery.min.js" type="text/javascript"></SCRIPT>
<script src="__COMPATH__/lib/Validform/5.3.2/Validform.min.js" type="text/javascript" ></script>
<SCRIPT type="text/javascript">

$(function(){

	//得到焦点

	$("#password").focus(function(){

		$("#left_hand").animate({

			left: "150",

			top: " -38"

		},{step: function(){

			if(parseInt($("#left_hand").css("left"))>140){

				$("#left_hand").attr("class","left_hand");

			}

		}}, 2000);

		$("#right_hand").animate({

			right: "-64",

			top: "-38px"

		},{step: function(){

			if(parseInt($("#right_hand").css("right"))> -70){

				$("#right_hand").attr("class","right_hand");

			}

		}}, 2000);

	});

	//失去焦点

	$("#password").blur(function(){

		$("#left_hand").attr("class","initial_left_hand");

		$("#left_hand").attr("style","left:100px;top:-12px;");

		$("#right_hand").attr("class","initial_right_hand");

		$("#right_hand").attr("style","right:-112px;top:-12px");

	});

	

	$(".ldh").animate({ top:'0px'},1000);

	$(".adminlogin").fadeIn(1500);

 	

	var form=$(".registerform").Validform({tiptype:2});

	 



});



</SCRIPT>
</HTML>
